<!--
 * @author: 十一
 * @since: 2024-10-27
 * BarChart.vue
 * @desc: new page
-->
<template>
  <dv-charts :option="option" style="100%;height:95%" />
</template>

<script lang="ts" setup>
import { ref } from "vue";
const option = {
  xAxis: {
    data: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"],
    axisLabel: {
      //坐标轴标签配置
      style: {
        fill: "#ffffff",
        fontSize: 10,
        rotate: 0,
      },
    },
    axisLine: {
      //坐标轴线配置
      style: {
        stroke: "#ffffff",
        lineWidth: 1,
      },
    },
  },
  axisLine: {
    //坐标轴线配置
    style: {
      stroke: "#ffffff",
      lineWidth: 1,
    },
  },
  yAxis: {
    data: "value",
    axisLabel: {
      //坐标轴标签配置
      style: {
        fill: "#ffffff",
        fontSize: 10,
        rotate: 0,
      },
    },
    axisLine: {
      //坐标轴线配置
      style: {
        stroke: "#ffffff",
        lineWidth: 1,
      },
    },
  },
  series: [
    {
      data: [1200, 2230, 1900, 2100, 3500, 4200, 3985],
      type: "line",
      smooth: true,
      lineArea: {
        show: true,
        gradient: ['rgba(55, 162, 218, 0.6)', 'rgba(55, 162, 218, 0)']
      }
    },
  ],
};
</script>

<style lang="less" scoped></style>
